<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<style>
    table {
        border: 1px solid black;
        border-collapse: collapse;
    }

    tr,
    th,
    td {
        border: 1px solid black;
        width: 300px;
        height: 40px;
    }
</style>

<body>
    姓名：<input type="text">
    年龄：<input type="text">
    电话：<input type="text">
    邮箱：<input type="text">
    性别：<input type="text">
    民族：<input type="text">
    <button>提交</button>
    <table>
        <thead>
            <tr>
                <th>姓名</th>
                <th>年龄</th>
                <th>电话</th>
                <th>邮箱</th>
                <th>性别</th>
                <th>民族</th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</body>
<script>
    $(function () {


        $('button').click(function () {
            var int1 = $('input:eq(0)').val()
            var int2 = $('input:eq(1)').val()
            var int3 = $('input:eq(2)').val()
            var int4 = $('input:eq(3)').val()
            var int5 = $('input:eq(4)').val()
            var int6 = $('input:eq(5)').val()
            var lis = `<tr>
                            <th>${int1}</th>
                            <th>${int2}</th>
                            <th>${int3}</th>
                            <th>${int4}</th>
                            <th>${int5}</th>
                            <th>${int6}</th>
                        </tr>`
            $('tbody').append(lis)
        })
    })
</script>

</html>